<template>
  <div>
    <div class="sum">
      <div class="anchorbox">
        <div class="anchor">
          <img :src="anchorimgUrl">
        </div>
        <div class="anchor-msg">

          <div class="anchorname">
             {{anchorname}}
          </div>
          <div class="msg">
            {{anchormsg}}
          </div>

        </div>

      </div>
    </div>


  </div>
</template>

<script>
export default {
  props:{
    anchorimgUrl:{
      type:String,
      default:''
    },
    anchorname: {
      type: String,
      default: '张惠妹'
    },

    anchormsg:{
      type:String,
      default:''
    },

    anchorId:{
      type:Number,

    }

  }

}
</script>

<style  scoped>
html,body{
  padding: 0;
  margin: 0;
  width: 100%;
}
.anchorbox{
  width: 250px;
  height: 62px;
  display: flex;
  //margin-top: 10px;
  background: #ffffff;
}
.msg{
  font-size: 12px;
  position: relative;
  top: 5px;
  height: 16px;
  margin-left: 5px;
}
.anchor-msg{
  position: relative;
  //border: 1px solid gainsboro;
  width: 260px;


}
.anchorname {
  font-weight: 500;
  font-size: 12px;
  height: 18px;
  color: black;
  margin-left: 5px;
  padding: 5px 0;

}
.anchor{
  margin-top: 8px;
}

</style>